<template>
	<view>
		<uni-grid :column="3" :showBorder="false">
			<uni-grid-item url="../install/install">
				<image class="btn-icon" src="../../static/images/yewus/install.png" mode="widthFix"></image>
				<text class="btn-text">开通</text>
			</uni-grid-item>
			<uni-grid-item @tap="gotoYewu('../fix/fix')">
				<image class="btn-icon" src="../../static/images/yewus/fix.png" mode="widthFix"></image>
				<text class="btn-text">报修</text>
			</uni-grid-item>
			<uni-grid-item @tap="gotoYewu('../stop/stop')">
				<image class="btn-icon" src="../../static/images/yewus/stop.png" mode="widthFix"></image>
				<text class="btn-text">报停</text>
			</uni-grid-item>
			<uni-grid-item @tap="gotoYewu('../restore/restore')">
				<image class="btn-icon" src="../../static/images/yewus/restore.png" mode="widthFix"></image>
				<text class="btn-text">恢复用水</text>
			</uni-grid-item>			
			<uni-grid-item @tap="gotoYewu('../tousu/tousu')">
				<image class="btn-icon" src="../../static/images/yewus/tousu.png" mode="widthFix"></image>
				<text class="btn-text">投诉举报</text>
			</uni-grid-item>		
		</uni-grid>
		<view class="bottom horizontal">
			<button style="color: white;background-color: var(--color-ok);" class="capsule scale" @tap="gotoProgress">查看办理进度</button>
		</view>
	</view>
</template>

<script>
	
	export default {
		data() {
			return {
				binded: false,
			}
		},
		onLoad(opts) {
			this.binded = opts.binded
		},
		methods: {
			gotoYewu(url, toast="请先绑定房号, 或进行开通"){
				console.log('sddfd')
				if(this.binded=='yes'){
					uni.navigateTo({
						url,
					})
				}else if(this.binded=='no'){
					uni.showToast({
						title: toast,
						icon: 'none'
					})
				}
			},
			gotoProgress(){
				if(this.binded=='yes'){
					uni.navigateTo({
						url:'../progress/progress',
					})
				}else if(this.binded=='no'){
					uni.showToast({
						title: '请先绑定房号, 或进行开通',
						icon:'none'
					})
				}
			}
		}
	}
</script>

<style scoped>
	page{
		background: white;
	}
	image{
		width: 98rpx;
		height: 98rpx;
	}
</style>
